<template>
	<view>
		<!-- footer-->
		<view class="foot-container">
			<view class="container-div flex-column">
				<view class="foot-top ">
					<view class="flex-space-between foot-border">					
						<view v-for="(item,index) in navList" :key="index"  :class="navIndex==index ? 'activite foot-nav' : 'foot-nav'">
							  {{item.name}}
						</view>						
					</view>
				</view>
				<view class="w1200 foot-fg"></view>
				<view class="foot-bottom">
					<view class="foot-bottom-font">
						<text>Copyright © 2023 yizhichang.com All Rights Reserved | 沪ICP备2023021547号-3</text>
					</view>
					
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				navIndex:11,
				navList:[
					{
						name:'关于我们',
						id:'0'
					},
					{
						name:'联系我们',
						id:'1'
					},
					{
						name:'咨询师入驻',
						id:'2'
					},
					{
						name:'合伙人计划',
						id:'3'
					}
				]
			}
		},
		methods: {
			openPage(url) {
				uni.navigateTo({ url })
			}
		}
	}
</script>

<style lang="scss">
	.foot-container {
		width: 100%;
		height: 210px;	
		padding: 40px 0 10px 0;
		background-color: #EEEEEE;
		background-repeat: no-repeat;
		background-size: 100%  210px;
		background-image: url('');
	}
	.foot-top {
		width: 50%;
		margin: 0 auto;
	}
	
	.foot-border {
		padding-bottom: 20px;
	}
	.foot-nav{		
		font-size: 24px;
		color: $font-text-white;
		cursor: pointer;
	}
	.foot-nav:hover{
		font-weight: bold;
		   transition: all .5s;
	}
	.activite{
		font-weight: bold;
	}
	.foot-fg{
		height:1px;
		background-color: $font-text-white;
		opacity: 0.5;
	}
	.foot-bottom {
		text-align: center;
	}
	
	.foot-bottom-font {
		padding: 10px 0;
		text {
			color:$font-text-foot;
		}
	}
</style>
